@import './theme.scss';

/* ----页面布局----begin */
// 块
.section {
  background-color: #fff;
  margin: 10px 10px 0;
  padding: 5px;
  box-shadow: 0 0 5px #ccc;

  &_head {
    background-color: #fff;
    padding: 5px 15px;
    font-size: 16px;
    box-shadow: 0 0 5px #ccc;
  }

  &_inner {
    background: rgb(236, 245, 255);
    // border-left: 4px solid #0076f6;
    padding: 5px;
    font-size: 15px;
    font-weight: 700;
  }
}

.section_title {
  font-weight: 700;
  font-size: 15px;
}

.flex_column {
  height: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;

  &_next {
    display: flex;
    flex-direction: column;
    overflow: auto;
    box-sizing: border-box;
  }
}



.flex_row {
  display: flex;
  justify-content: space-between;
}

.flex_e_center {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.flex_1 {
  flex: 1;
}

.flex_1_auto {
  flex: 1;
  overflow: auto;
}

.flex_center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex_a_center {
  display: flex;
  align-items: center;
  white-space: nowrap;
  flex-wrap: wrap;
}

.flex_b_center {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flex_h_center {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}


.icon_warning {
  font-size: 15px;
  color: #ff943d;
  cursor: pointer;
  margin: 0 10;
}

.icon_success {
  font-size: 15px;
  color: #15bc83;
  cursor: pointer;
  margin: 0 10;
}

.icon_error {
  font-size: 15px;
  color: #f15643;
  cursor: pointer;
  margin: 0 10;
}

.icon_normal {
  font-size: 15px;
  color: #0076f6;
  cursor: pointer;
  margin: 0 10;
}

.icon_warning_ {
  font-size: 15px;
  color: #ff943d;
  margin: 0 10;
}

.icon_success_ {
  font-size: 15px;
  color: #15bc83;
  margin: 0 10;
}

.icon_error_ {
  font-size: 15px;
  color: #f15643;
  margin: 0 10;
}

.icon_normal_ {
  font-size: 15px;
  color: #0076f6;
  margin: 0 10;
}

.shadow_border_normal {
  border-radius: 0;
  box-shadow: 0 0 5px #ccc;
}

.shadow_border {
  line-height: 30px;
  border-radius: 0;
  box-shadow: 0 0 5px #ccc;
}

.filtrate_boxs {
  margin: 10px 10 0;
  background-color: #fff;
  // box-shadow: 0 0 5px #ccc;
  display: flex;

  .filtrates {
    padding: 10 40px;
    font-size: 14px;
  }

  .active {
    text-align: center;
    min-width: 60px;
    padding: 10 40px;
    font-size: 14px;
    cursor: pointer;
    background-color: #0076f6;
    color: #fff;
    font-weight: 700;
  }

  .filtrates:hover {
    background-color: #86bbf3;
    color: #fff;
    cursor: pointer;
  }
}

.imgStyle {
  height: 20px;
  width: 20px;
  margin: 0px 3px;
}

.paging {
  text-align: center;
  padding: 2px;
  background-color: #fff;
}

.code_underline {
  color: #0076f6;
  cursor: pointer;
  text-decoration: underline;
}

.rect_box {
  margin-top: 0px;
  width: 60%;
  height: 365px;
  padding-bottom: 25px;
  // overflow:scroll;
}

// .order_rect_box {
//   width: 57%;
// }

.big_rect_box {
  box-sizing: border-box;
  margin-top: 0px;
  width: 40%;
  height: 405px;
  margin-left: 0;
  padding-bottom: 20px;
}

.cur {
  cursor: pointer;
}

/* ----页面布局----begin */
/*可公用自定义样式 begin*/
.cursor {
  &:hover {
    opacity: 0.8;
  }

  cursor: pointer;
}

.h_page_fixed {
  position: fixed;
  bottom: 0;
  left: 220px;
  margin: 0 10px;
  width: calc(100% - 245px);
  padding: 8px 0;
  background-color: #fff;
  text-align: center;
  border-top: 1px solid #f2f2f2;
  border-radius: 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  -ms-border-radius: 5px 5px 0 0;
  -o-border-radius: 5px 5px 0 0;
  z-index: 4;
}

.record_show {
  width: 21.4%;
  height: 94px;
}

.record_show:nth-child(3n) {
  margin: 10px 0;
}

.record_show:first-child {
  margin-right: 0;
}

.agentTop {
  box-sizing: border-box;
  padding-top: 30px;
}

.agent_time {
  box-sizing: border-box;
  padding-top: 25px;
}

.agent_order {
  box-sizing: border-box;
  padding-left: 10px;
  font-weight: 700;
}

.pad_top {
  box-sizing: border-box;
  padding-top: 10px;
}

/*可公用自定义样式 end*/

/*跳转链接begin*/
.my_link {
  text-decoration: underline;
  cursor: pointer;
  color: #333333;

  &:hover {
    opacity: 0.7;
  }

  &.blue {
    color: #2d76ec;
  }

  &.deep_blue {
    color: #455b63;
  }

  &.yellow {
    color: #ea8d00;
  }
}

/*跳转链接end*/

/* 自定义校验样式提示 */
.error_tip {
  color: #f56c6c;
  font-size: 14px;
  opacity: 1;
}

.msg_tip {
  color: #757575;

  &_err {
    color: var(--danger);
  }

  &_green {
    color: var(--green);

    &_1 {
      color: var(--green) !important;
    }
  }

  &_yellow {
    color: var(--submit) !important;
  }

  &_blue {
    color: var(--other) !important;
  }

  &_red {
    color: var(--delete) !important;
  }
}

.tip_item {
  margin-left: 10px;
}

.nodata {
  color: #999;
  padding: 10px;

  &_center {
    color: #999;
    padding: 10px;
    text-align: center;
  }
}

.input_inner_tip {
  color: #333;
  line-height: 40px;
}

/* 超出隐藏 begin*/
.hide_text {
  /* 设置文字超出隐藏 单行 */
  /* max-width: 300px; */
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;

  &.line_one {
    /* white-space: nowrap; */
  }

  &.line_two {
    -webkit-line-clamp: 2;
  }
}

/* 超出隐藏 end*/
/* pc端加载样式 begin*/

.el-loading-spinner .path {
  stroke: #83a6fa !important;
}

.el-loading-spinner .el-loading-text {
  color: #999999 !important;
}

/* pc端加载样式 end*/

/* ------------按钮------------ */

button {
  border: none;
  cursor: pointer;
  background-color: transparent;
  color: #333;
  font-size: 12px;

  &.operate_btn {
    margin-left: 10px;
    padding: 7px 15px;
    background-color: #f2f2f2;
    border: 1px solid #f2f2f2;
    color: #757575;
    min-width: 60px;

    &.mini {
      padding: 5px 14px;
    }

    // display: flex;
    // align-items: center;
    &:hover {
      border: 1px solid #019fe8;
      background-color: #fff;
      color: #019fe8;
    }

    &.disabled,
    &:disabled {
      border: 1px solid #f2f2f2;
      color: #ccd0d8;
      background-color: #f2f2f2;

      &:hover {
        border: 1px solid #f2f2f2;
      }
    }
  }

  &.tab_btn {
    color: #2d76ec;
  }

  &.tab_add {
    color: #019fe8;
  }

  &:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }

  .sbb_icon {
    margin-right: 3px;
  }
}

/* ------------按钮------------ */

// 设置文字选中样式
::selection {
  background: #0987db;
  color: #fff;
}

// 设置文字不可选中、不可复制
.no_select {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* ------------文字样式------------ e*/

/* 消息提示 begin*/
.notify_error {
  z-index: 2099 !important;
}

/*-------搜索表单----- begin*/
.my-search {
  &_select {
    width: 128px;
    margin: 0 5px;

    &_mini {
      width: 105px;
      margin: 0 5px;
    }

    &.max {
      width: 420px;
      margin: 0 5px;
    }
  }

  &_input {
    width: 200px;
    margin: 0 5px;

    &_mini {
      width: 180px;
      margin: 0 5px;
    }

    &_max {
      width: 260px;
      margin: 0 5px;
    }
  }

  &_datetime {
    width: 240px !important;
    margin: 0 5px;
  }

  &_switch {
    margin-right: 6px;
  }

  &_btn {
    margin: 5px 5px 0 !important;
  }
}

// 右侧操作按钮
.btn_box {
  margin-left: 10px;

  .btn_search {
    padding: 13px 38px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;

    &_min {
      padding: 7px 17px;
      border-radius: 0;
      -webkit-border-radius: 0;
      -moz-border-radius: 0;
      -ms-border-radius: 0;
      -o-border-radius: 0;
    }
  }
}

/*-------搜索表单----- end*/
/* ----商品条码、编码左对齐---- */
.goods_code_text_left {
  text-align: left;
}

/*-------表格----- begin*/
//按钮组
.sec_btn_box {
  text-align: right;
}

// 分页
.h_page {
  margin-top: 8px;
  background-color: #fff;
  padding: 5px 0;
  text-align: center;
}

// 表格
.table_box {
  .tab_operate {
    border: 1px solid #e9e9e9;
    border-top: none;
    padding: 10px 0;
    text-align: center;

    .el-button {
      padding: 10px 33px;
    }

    .tab_total {
      display: flex;
      align-items: center;
      justify-content: space-around;
      font-size: 14px;
      font-weight: 700;

      &>span {
        padding: 5px;
        width: 50%;
      }
    }
  }
}

/*-------表格----- end*/
/* 自定义颜色 nprogress */
#nprogress .bar {
  background: linear-gradient(to right, #f95e5a 5%, #ffac13 20%, #4bd863 70%);
  height: 3px;
}

/* ------------切换页面渐变------------ b*/
.fade-transform-leave-active,
.fade-transform-enter-active {
  transition: all 0.1s;
  -webkit-transition: all 0.1s;
  -moz-transition: all 0.1s;
  -ms-transition: all 0.1s;
  -o-transition: all 0.1s;
}

.fade-transform-enter {
  opacity: 0;
  transform: translateX(-30px);
}

.fade-transform-leave-to {
  opacity: 0;
  transform: translateX(30px);
}

/*-------弹框----- end*/

/* 商品选购样式  start */
.product_btn {
  background-color: #ee8355;
  color: #fff;
  border-radius: 20px;
  border: 1px solid #ff9f24;
}



/* 商品选购和计数器样式  end */
@import './type/scrollbar.scss'; //滚动条样式
@import './type/form.scss'; //表单样式
@import './type/dialog.scss'; //弹框样式
@import './type/table.scss'; //表格样式
@import './type/detailPage.scss'; // 详情样式
@import './type/drawer.scss'; // 抽屉样式
@import './type/order-detail.scss'; //公告管理样式

/* 表格固定列-鼠标事件穿透 */
.el-table__fixed,
.el-table__fixed-right {
  pointer-events: none;
}

/* th为表头单元格，td为表格体单元格 */
/* 如果需要禁止固定列里的单元格也无法点击，此处可修改为none */
.el-table__fixed td,
.el-table__fixed-right td,
.el-table__fixed th,
.el-table__fixed-right th {
  pointer-events: auto; 
}


.tag_primary{
	background-color: #E6F1FE;
	border: 1px #99C8FD solid;
	color: #409EFF;
	padding: 4px 6px;
	border-radius: 5px;
}
.tag_success{
	background-color: #F0F9EB;
	border: 1px #C2E7B0 solid;
	color: #67C23A;
	padding: 4px 6px;
	border-radius: 5px;
}
.tag_info{
	background-color: #F4F4F5;
	border: 1px #D3D4D6 solid;
	color: #909399;
	padding: 4px 6px;
	border-radius: 5px;
}
.tag_warning{
	background-color: #FDF6EC;
	border: 1px #F5DAB1 solid;
	color: #E6A23C;
	padding: 4px 6px;
	border-radius: 5px;
}
.tag_danger{
	background-color: #FEF0F0;
	border: 1px #FBC4C4 solid;
	color: #F56C6C;
	padding: 4px 6px;
	border-radius: 5px;
}